$(function () {
    $("#jqGrid").jqGrid({
        url: baseURL + 'biz/grabpacket/list',
        datatype: "json",
        colModel: [			
			{ label: 'id', name: 'id', index: 'id', width: 50, key: true, hidden: true },
			{ label: '房间', name: 'roomName', index: 'room_id', width: 80 },
			{ label: '头像', name: 'headImg', index: 'grab_member_id', width: 50,
				formatter: function(value, options, row) {
					return "<img style='width: 50px; height: 50px;' class='img-circle' src='" + value + "'>";
				}
			},
			{ label: '会员ID', name: 'grabMemberId', index: 'grab_member_id', width: 50 },
			{ label: '手机号', name: 'mobile', index: 'grab_member_id', width: 80 },
			{ label: '红包详情', name: 'sendPacketId', index: 'send_packet_id', width: 50 ,
				formatter: function(value, options, row) {
					return '<a href="javascript:sendPacketDetail(' + value + ')" class="">红包ID:' + value + '</span>';
				}
			}, 			
			{ label: '抢包金额', name: 'grabAmount', index: 'grab_amount', width: 80 ,
				formatter: function(value, options, row) {
					return value.toFixed(2);
				}
			}, 			
			{ label: '是否踩雷', name: 'isLandmine', index: 'is_landmine', width: 50,
				formatter: function(value, options, row) {
					if (value == 0) {
						return '<span class="label label-primary">否</span>';
					} else {
						return '<span class="label label-danger" title="-' + row.landmineAmount + '">是</span>';
					}
				}
			},
			{ label: '机器人', name: 'isRobot', index: 'is_robot', width: 50,
				formatter: function(value, options, row) {
					if (value == 0) {
						return '<span class="label label-primary">否</span>';
					} else {
						return '<span class="label label-danger">是</span>';
					}
				}
			}, 
			{ label: '抢包时间', name: 'createTime', index: 'create_time', width: 80 }			
        ],
		viewrecords: true,
        height: 385,
        rowNum: 10,
		rowList : [10,30,50],
        rownumbers: true, 
        rownumWidth: 25, 
        autowidth:true,
        multiselect: true,
        pager: "#jqGridPager",
        jsonReader : {
            root: "page.list",
            page: "page.currPage",
            total: "page.totalPage",
            records: "page.totalCount"
        },
        prmNames : {
            page:"page", 
            rows:"limit", 
            order: "order"
        },
        gridComplete:function(){
        	//隐藏grid底部滚动条
        	$("#jqGrid").closest(".ui-jqgrid-bdiv").css({ "overflow-x" : "hidden" }); 
        }
    });
});

var vm = new Vue({
	el:'#rrapp',
	data:{
		q: {}
	},
	methods: {
		query: function () {
			vm.reload();
		},
		reload: function (event) {
			var page = $("#jqGrid").jqGrid('getGridParam','page');
			$("#jqGrid").jqGrid('setGridParam',{ 
				postData:vm.q,
                page:page
            }).trigger("reloadGrid");
		}
	}
});

function sendPacketDetail(id){
	layer.open({
		  type: 1,
	      title: '红包信息',
	      area: ['700px', '500px'],
	      content: '<table class="table">' + 
				'<tr><td><b>会员ID</b></td><td id="send_memberid"></td><td><b>手机号</b></td><td id="send_mobile"></td></tr>' + 
				'<tr><td><b>红包状态</b></td><td id="send_status"></td><td><b>是否机器人</b></td><td id="send_isrobot"></td></tr>' + 
				'<tr><td style="vertical-align: middle;"><b>发包金额</b></td><td id="send_amount"></td><td style="vertical-align: middle;"><b>数量</b></td><td id="send_packetqty"></td></tr>' + 
				'<tr><td><b>雷点</b></td><td id="send_landmine"></td><td><b>平台抽成</b></td><td id="send_fee"></td></tr>' + 
				'<tr><td><b>发包时间</b></td><td id="send_createtime"></td><td>&nbsp</td><td>&nbsp</td></tr>' + 
				'</table>',
	      success: function() {
	    	  $.getJSON(baseURL + "biz/sendpacket/info?id=" +  id, function(result){
	    		  if(result.code == 0) {
	    			  $("#send_memberid").text(result.send.memberId);
	    			  $("#send_mobile").text(result.send.mobile);
	    			  $("#send_status").html(result.send.status == 0 ? '<span class="label label-primary">进行中</span>' : ('<span class="label label-danger">已结束' + (result.send.status == 3 ? "(已退款)" : "") + '</span>'));
	    			  $("#send_isrobot").html(result.send.isRobot == 0 ? '<span class="label label-primary">否</span>' : '<span class="label label-danger">是</span>');
	    			  $("#send_amount").html('红包：<label>￥' + result.send.amount + '</label><br/>已抢：<label>￥' + result.send.grabAmount + '</label><br/>未抢：<label>￥' + result.send.balanceAmount + '</label><br/>');
	    			  $("#send_packetqty").html('总数：<label>' + result.send.packetQty + '个</label><br/>已抢：<label>' + result.send.grabQty + '个</label><br/>未抢：<label>' + result.send.balanceQty + '个</label><br/>');
	    			  $("#send_landmine").text(result.send.landmine);
	    			  $("#send_fee").text(result.send.fee);
	    			  $("#send_createtime").text(result.send.createTime);
	    		  }
	    	  });
	      }
	});
}